//导入基础库，核心模块
import React, { Component } from 'react';
//reactDOM 处理dom用的，document object model 标签
import ReactDOM from 'react-dom/client';



const root = ReactDOM.createRoot(
  //获取id为root的标签
  document.getElementById('root') as HTMLElement
);

function Header(){
  return <>
    <header>头部内容</header>
  </>
}

const Content=()=>{
  return <main>内容</main>
}

function Footer(){
  return  <footer>底部内容</footer>
}

//组件嵌套
class App extends Component{
  render(){
    return(
      <>
        <Header/>
        <Content/>
        <Footer></Footer>
      </>
    )
    
  }
}


//入口根元素渲染组件app组件
root.render(
  //默认开启严格模式
  // <React.StrictMode>
   
  // </React.StrictMode>
  <App/>
);

